<template>
  <div style="margin-top: 10px">
    <el-row :gutter="20">
      <el-col :span="8" v-if="type === 1">
        <div class="text-center">序号</div>
      </el-col>
      <el-col :span="type !== 1 ? 10 : 8">
        <div class="text-center">客户名称</div>
      </el-col>
      <el-col :span="type !== 1 ? 11 : 8">
        <div class="text-center" v-if="listType === 0">重点客户依据</div>
        <div class="text-center" v-else>依据</div>
      </el-col>
<!--      <el-col :span="3"  v-if="type !== 1">-->
<!--        <div class="text-center"></div>-->
<!--      </el-col>-->
    </el-row>
    <el-row :gutter="20" v-for="(item, ind) in tableData" :key="ind" style="margin-top: 4px">
      <el-col :span="8" v-if="type === 1">
        <div class="text-center">
          {{ ind + 1 }}
        </div>
      </el-col>
      <el-col :span="type !== 1 ? 10 : 8">
        <div class="text-center">
          <el-input size="mini" :readonly="type === 1" v-model.trim="item.schoolName"/>
        </div>
      </el-col>
      <el-col :span="type !== 1 ? 11 : 8">
        <div class="text-center">
          <el-input size="mini" :readonly="type === 1" v-model.trim="item.basis"/>
        </div>
      </el-col>
<!--      <el-col :span="3" v-if="type !== 1">-->
<!--        <div class="text-center" v-if="type !== 1">-->
<!--          <el-button type="primary" icon="el-icon-plus" plain circle @click="addMarket"></el-button>-->
<!--          <el-button type="danger" v-if="ind >= 1" icon="el-icon-minus" plain circle @click="removeMarket(item, ind)"></el-button>-->
<!--          <div v-else style="display: inline-block;width: 36px;height: 23px;margin-left: 10px;line-height: 1"></div>-->
<!--        </div>-->
<!--      </el-col>-->
    </el-row>
  </div>
</template>

<script>
export default {
  name: "MultiAgentTable",
  data() {
    return {
      list: [],
    }
  },
  props: {
    // 类型 0：重点 1：普通 2：潜在
    listType: {
      type: Number,
      default: 0
    },
    type: {
      type: Number,
      default: 1
    },
    tableData: {
      type: Array,
      required: true
    }
  },
  watch: {
    tableData: {
      deep: true,
      immediate: true,
      handler(newV) {
        this.list = newV
      }
    },
  },
  methods: {
    // 用户输入的回调
    inputHandler(e, index) {
      if (+e < 0) this.tableData[index].amount = 0
    },
    addMarket() {
      let flag = 0
      this.list.map((item) => {
        if(item.flag > flag) flag = item.flag
      })

      const planId = this.list[0]?.planId ?? null

      this.list.push({
        id: null,
        userId: this.$store.state.user.id,
        planId,
        schoolName: "",
        basis: "",
        flag: flag + 1,
        remark: null,
        createTime: "",
        createBy: this.$store.state.user.nickName,
        updateTime: null,
        updateBy: this.$store.state.user.nickName,
        deptId: null,
        type: this.listType, // 类型 0：重点 1：普通 2：潜在
      })
      console.log(this.list)
      this.$emit('update:tableData', this.list)
    },
    async removeMarket(row, index) {

      if(row.id) {
        const res = await deleteDataApi({ id: row.id, type: 3 })

        if(res.code === 200) {
          this.$message([{
            message: res.msg,
            type: 'success'
          }]);
          this.list.splice(index, 1)
          this.$emit('update:tableData', this.list)
        } else {
          this.$message({
            message: res.msg,
            type: 'error'
          });
        }
      } else {
        this.list.splice(index, 1)
        this.$emit('update:tableData', this.list)
      }
    },
  }
}
</script>

<style scoped lang="scss">

</style>
